<style>
    .detailLable{
        width: 160px;
    }
    .detailInput{
        margin-left: 15%;
    }
    .layui-layout-body {
        overflow-y: auto;
    }
    .detail-form-item{
        width: 1580px;
    }

</style>
<div class="layui-card-body">
    <form class="layui-form" action="" lay-filter="workflowDetail">
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">分类：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="typeName"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">流程标题：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="name"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">流程定义key：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="modelKey"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">任务标题生成规则：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="taskNameRule"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">流程描述：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="description"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">创建人：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="createBy"  autocomplete="off" class="layui-input" readonly="readonly" style="cursor: pointer; color: #1E9FFF"/>
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">创建时间：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="createTime"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">更新人：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="updateBy"  autocomplete="off" class="layui-input" readonly="readonly" style="cursor: pointer;color: #1E9FFF"/>
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">更新原因：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="modelComment"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">更新时间：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="updateTime"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">流程状态：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="status"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">版本号：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="version"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item">
            <label class="layui-form-label detailLable">activiti流程定义ID：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="procDefId"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
        <div class="layui-form-item detail-form-item" >
            <label class="layui-form-label detailLable">act流程定义Key：</label>
            <div class="layui-input-block detailInput">
                <input type="text" name="procDefKey"  autocomplete="off" class="layui-input" readonly="readonly" />
            </div>
        </div>
    </form>
</div>
<script>
    layui.use(['setter','element','util','form'], function () {
        var setter=layui.setter
            ,element = layui.element
            ,$ = layui.$
            ,util = layui.util
            ,form=layui.form;
        var modelId = "${modelId}";

        function getValue(data){
            return data==null?"":data;
        }

        // 点击授权人员弹窗
        window.authUserClick = function(ownerId){
            layer.open({
                type: 2,
                title: '人员详细信息',
                area: ['938px', '620px'],
                shadeClose: true,
                content: serverPath.systemPath + setter.sysLinkPath + 'sysUser/view/view?userId=' + ownerId
            });
        };

        $.ajax({
            url: serverPath.workflowPath + setter.workflowLinkPath+"actDefModel/model/detail?modelId="+modelId,
            type: "get",
            contentType: 'application/json',
            dataType: 'json',
            success: function (data) {
                var returnData = data.data;
                $("[name='typeName']").val(getValue(returnData.typeName));
                $("[name='name']").val( getValue(returnData.name));
                $("[name='modelKey']").val(getValue(returnData.modelKey));
                $("[name='taskNameRule']").val( getValue(returnData.taskNameRule));
                $("[name='description']").val( getValue(returnData.description));
                $.get( serverPath.systemPath + setter.sysLinkPath + "sysUser/get?userId="+returnData.createBy,function(userData,status){
                    if(userData.code==0){
                        $("[name='createBy']").val( userData.data.fullName);
                        $("[name='createBy']").on('click',function () {
                            authUserClick(userData.data.userId)
                        })
                    }
                },"json");
                var createTime = util.toDateString(returnData.createTime, "yyyy-MM-dd HH:mm:ss");
                $("[name='createTime']").val( createTime );
                $("[name='modelComment']").val( getValue(returnData.modelComment));
                if(returnData.updateBy!=""){
                    $.get(serverPath.systemPath + setter.sysLinkPath + "sysUser/get?userId="+returnData.updateBy,function(userData,status){
                        if(userData.code==0){
                            $("[name='updateBy']").val(userData.data.fullName);
                            $("[name='updateBy']").on('click',function () {
                                authUserClick( userData.data.userId )
                            })
                        }
                    },"json");
                    var updateTime = util.toDateString(returnData.updateTime, "yyyy-MM-dd HH:mm:ss");
                    $("[name='updateTime']").val( updateTime);
                }
                var status = returnData.status;
                if (status === 1) {
                    status = "启用";
                } else if (status === 2) {
                    status = "禁用";
                } else if (status === 3) {
                    status = "禁用(实例)";
                } else if (status === 4) {
                    status = "测试";
                } else {
                    status = "未知";
                }
                $("[name='status']").val(status );
                $("[name='version']").val( returnData.version );
                $("[name='procDefId']").val( returnData.procDefId );
                $("[name='procDefKey']").val( returnData.procDefKey );
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                layer.alert("暂无数据，请稍后操作！" + XMLHttpRequest.status);
            }
        });
    });
</script>